Σχεδιασμός Ιστοσελίδας: 10 Κρίσιμα Σημεία για να Ξεχωρίσετε

Ο σχεδιασμός ιστοσελίδας είναι ο καθρέφτης σας στον κόσμο του internet. Η βιτρίνα που θα κοιτάξει ο επισκέπτης και θα τον κρατήσει για να δει περισσότερα ή θα τον απομακρύνει, στέλνοντάς τον στη βιτρίνα κάποιου ανταγωνιστή.

Πολλές φορές υπάρχει σύγχυση μεταξύ σχεδιασμού ιστοσελίδας και κατασκευής ιστοσελίδας. Ενώ και τα δύο αφορούν το ίδιο “προϊόν”, είναι στην πραγματικότητα πολύ διαφορετικά μεταξύ τους.

Ο σχεδιασμός ιστοσελίδας αφορά το δημιουργικό κομμάτι, τη θέση των στοιχείων σε ένα σύνολο, τα χρώματα, τις γραμματοσειρές, την τονικότητα των φωτογραφιών και των γραφικών. Είναι μια εργασία που αναλαμβάνει το σχεδιαστικό τμήμα της εκάστοτε εταιρίας.

Η κατασκευή ιστοσελίδας από την άλλη, αφορά το κομμάτι του κώδικα, των frameworks που θα χρησιμοποιηθούν, τη βελτιστοποίηση των δομικών στοιχείων μιας ιστοσελίδας. Αυτή είναι μια εργασία που αναλαμβάνει το δημιουργικό τμήμα.

Αν παρομοιάζαμε το παραπάνω με το χτίσιμο μιας οικοδομής, ο σχεδιαστής θα ήταν ο αρχιτέκτονας μαζί με τον διακοσμητή, ενώ ο κατασκευαστής θα ήταν ο εργολάβος μαζί με το εργατικό δυναμικό του.

Ο σχεδιασμός ιστοσελίδας προέχει πάντα της κατασκευής καθώς είναι αυτός που δίνει τις βάσεις για όλο το υπόλοιπο.

Σύμφωνα με μια σχετικά πρόσφατη μελέτη, το 75% των επισκεπτών, κρίνει την αξιοπιστία μια εταιρίας από την εικόνα της ιστοσελίδας της. Εδώ έρχεται και δένει ένα από τα αγαπημένα μας quotes:

Ποτέ δεν έχεις δεύτερη ευκαιρία, να κάνεις καλή πρώτη εντύπωση.

Σίγουρα θα έχει τύχει να μπείτε σε μια ιστοσελίδα και η πρώτη σας έκφραση να είναι: “Κουράστηκα!”. Όσο καλή διάθεση και να έχετε, αν η ιστοσελίδα δε σας βοηθά να βρείτε αυτό που θέλετε το πιθανότερο είναι να την εγκαταλείψετε. Η σωστή οπτική επικοινωνία είναι εξαιρετικά σημαντική στη σημερινή ψηφιακή αγορά.

Σε αυτό το άρθρο, θα σας παραθέσουμε 10 σημεία κλειδιά που πρέπει να προσέξετε στον σχεδιασμό ιστοσελίδας.

1. Σχεδιασμός ιστοσελίδας: Τι είναι το UX;

UX είναι το ακρωνύμιο της φράσης “User Experience”. Αφορά δηλαδή την εμπειρία που “ζει” ο χρήστης όταν επισκεφτεί την ιστοσελίδα σας. Νιώθει άνετα; Οικεία; Ή μήπως κουράζεται;

Αν ισχύει το τελευταίο, τότε η εμπειρία είναι κακή με ό,τι αυτό συνεπάγεται. Και συνήθως αυτό συνεπάγεται με χαμένα έσοδα για την επιχείρησή σας.

Για να δημιουργηθεί ένα καλό user experience θα πρέπει να μελετηθεί κάθε έκφανση της ιστοσελίδας ξεχωριστά. Από την αρχική σελίδα μέχρι τη σελίδα επικοινωνίας.

Δεν είναι ανάγκη να ανακαλύψετε εκ νέου τον τροχό, οι χρήστες περιμένουν να βρουν κάποια πράγματα σε συγκεκριμένα σημεία. Μη τους παιδεύετε χωρίς λόγο.

Εξίσου σημαντικό στο UX είναι και η ταχύτητα της ιστοσελίδας. Σε κανέναν δεν αρέσει να περιμένει. Όπως αναλύσαμε και σε προηγούμενο άρθρο, η αργή ταχύτητα ιστοσελίδας συνεπάγεται με μειωμένα έσοδα.

Το UX όμως δεν περιορίζεται στον σχεδιασμό ιστοσελίδας. Υπάρχει παντού εκεί έξω, από τα αυτοκίνητα που ο οδηγός μπορεί από τη θέση του να χειριστεί άνετα όλες τις λειτουργίες του οχήματος, έως και μια τοστιέρα που έχει το κουμπί on/off σε εμφανές σημείο. Μοιάζει απλό αλλά έχουμε δει τοστιέρα με το κουμπί κρυμμένο στο πίσω μέρος. Αυτό είναι κακό UX όσο κι αν σας φαίνεται απλό και αμελητέο.

Το καλό UX έχει στόχο να κάνει τη ζωή μας πιο εύκολη, όχι πιο περίπλοκη.

Παράδειγμα καλού UX:

Στο συγκεκριμένο παράδειγμα, που αφορά ιστοσελίδα τουριστικής επιχείρηση στη Λέσβο, δίνουμε στον επισκέπτη “με το καλημέρα” αυτό για το οποίο ήρθε χωρίς να τον κουράζουμε άσκοπα. Δηλαδή να ελέγξει αν η μονάδα έχει διαθέσιμα δωμάτια.

Παράδειγμα κακού UX:

Στην ίδια ιστοσελίδα, πριν προχωρήσουμε σε αναβάθμιση, μπορείτε να δείτε πέρα από το γεγονός πως δεν υπάρχει κάποιο εμφανές στοιχείο προτροπής, ακόμα και το μενού είναι σχεδόν κρυμμένο. Όλο αυτό μπερδεύει τον επισκέπτη και μειώνει την αξιοπιστία της επιχείρησης.

2. Σχεδιασμός ιστοσελίδας: Τι είναι το UI;

UI είναι το ακρωνύμιο της φράσης “User Interface” και έχει να κάνει με τα στοιχεία που συνθέτουν τον σχεδιασμό ιστοσελίδας. Αφορά τα κουμπιά, τα μενού, τις φόρμες και όλα τα στοιχεία με τα οποία ο χρήστης αλληλεπιδρά.

Όταν το UI συνδυαστεί αρμονικά με το UX, έχουμε στα χέρια μας μια ιστοσελίδα που, αν μη τι άλλο, δημιουργεί στον επισκέπτη μια αίσθηση αρμονίας.

Αυτή η αρμονία είναι που οδηγεί σε περισσότερο χρόνο παραμονής στην ιστοσελίδα μας και κατά συνέπεια σε μεγαλύτερο ποσοστό δυνητικών πελατών.

Τα στοιχεία UI της ιστοσελίδα σας θα πρέπει να έχουν επαρκή αντίθεση μεταξύ τους ώστε να ξεχωρίζουν και να είναι τοποθετημένα στα σωστά σημεία. Σκεφτείτε το σαν μια βάρκα στη μέση μιας λίμνης, δε γίνεται να μη τη δεις!

Δείτε το παρακάτω παράδειγμα:

Η φόρμα αναζήτησης αυτοκινήτου βρίσκεται σε πρώτο πλάνο χωρίς περιττά στοιχεία δεξιά κι αριστερά. Είναι το σημείο που θέλουμε να εστιάσει ο χρήστης. Ακόμα και η φωτογραφία στο background δεν επιλέχθηκε τυχαία, καθώς η κοπέλα κοιτά προς εκεί. Οι άνθρωποι έχουμε την τάση να κοιτάμε εκεί που κοιτάνε οι άλλοι.

3. Πείτε στο χρήστη, τι θέλετε να κάνει!

Το να δίνετε καθοδήγηση στον επισκέπτη σας, αυξάνει κατά πολύ τη φιλικότητα της ιστοσελίδας σας.

Αν θέλετε να συμπληρώσει μια φόρμα, απλώς πείτε το. Αν θέλετε να διαβάσει κάτι σημαντικό, κάντε το εμφανές και προτρέψτε τον να το κάνει.

Σκεφτείτε το σα να μπαίνετε σε ένα κατάστημα και ο υπεύθυνος στην υποδοχή να σας καλωσορίζει λέγοντας σας “περάστε από δω”. Στο αντίθετο σενάριο, μπορεί να μπείτε πράγματι στο κατάστημα αλλά να μην ξέρετε προς τα που να κινηθείτε. Θα χάσετε χρόνο ρωτώντας και σε κανέναν δεν αρέσει να χάνει χρόνο.

Οι επισκέπτες σας δεν αποτελούν εξαίρεση.

Εδώ είναι που έρχεται σε εφαρμογή η σημαντικότητα του γνωστού και ως “Call to Action”, δηλαδή “κλήση σε ενέργεια”.

Aκόμα και μια μικρή λέξη μπορεί να κάνει τη διαφορά. Για παράδειγμα, αν θέλετε να εγγραφεί κάποιος στο newsletter σας, θα είχατε ένα κουμπί που θα έγραφε:

“Εγγραφή”

Γιατί όμως να μη γράψετε κάτι του τύπου:

“Δωρεάν εγγραφή!” ή “Κάντε εγγραφή”. Μια μικρή προσθήκη που μπορεί να κάνει τεράστια διαφορά.

Αναθεωρήστε λοιπόν, τα Call to Action της ιστοσελίδας σας και κάντε τα πιο στοχευμένα και ξεκάθαρα.

4. Ορίστε ποιο είναι το target group σας

Ένα κλασικό παράδειγμα είναι τα websites της Vodafone. Αν δείτε το κεντρικό της website, θα παρατηρήσετε ότι έχει αυστηρή corporate εμφάνιση.

Αν δείτε από την άλλη το website της για το CU, θα βρείτε μια εντελώς διαφορετική εικόνα. Πιο funky και πιο μοντέρνα καθώς απευθύνεται σε νεαρό κόσμο.

Ο σχεδιασμός ιστοσελίδας δε μπορεί να τους “πιάσει” όλους.

Το target group θα πρέπει να είναι καθορισμένο (έστω και πολύ γενικά) και πάνω σε αυτό να κινηθεί όλος ο σχεδιασμός.

Θα πρέπει αρχικά να αναρωτηθείτε: “Ποιό είναι το προφίλ του ιδανικού πελάτη μου;”

π.χ. Γυναίκες, ηλικίας 30-40 ετών, μεσαίου και υψηλού εισοδήματος με ανώτερη μόρφωση.

Ο σχεδιασμός ιστοσελίδας θα πρέπει να γίνει με βάση τα παραπάνω χαρακτηριστικά. Μόνο έτσι θα έχετε τα καλύτερα αποτελέσματα.

Φυσικά δε θα αποκλείσετε άλλες ομάδες επισκεπτών αλλά σίγουρα χρειάζεται μια σταθερή βάση, ένας ακρογωνιαίος λίθος.

5. Σχεδιασμός ιστοσελίδας με “εξεζητημένο” ή “κλασικό” design;

Η απάντηση σε αυτό αποτελεί απόρροια της πιο πάνω ερώτησης και πρέπει να αποφασιστεί βάση target group.

Πέρα όμως από αυτό, καλό είναι να έχετε στο μυαλό σας μερικά υπέρ και κατά των δύο αυτών προσεγγίσεων.

Εξεζητημένο design:

+ Εντυπωσιάζει στην πρώτη όψη
+ Σας διαφοροποιεί από τον ανταγωνισμό

– Ίσως μπερδέψει τους άπειρους ή μεγαλύτερης ηλικίας χρήστες
– Ίσως έχει μειωμένη αποτελεσματικότητα αν πρόκειται για ηλεκτρονικό κατάστημα

Κλασικό design:

+ Δεν εντυπωσιάζει απαραίτητα αλλά κάνει τη δουλειά του όπως πρέπει
+ Δεν έχει προβλήματα προσβασιμότητας

– Αν δε γίνει καλή έρευνα και custom σχεδιασμός μπορεί να μοιάζει αισθητά με κάποιο άλλο

Tο design δεν είναι σαν την τεκίλα. Δε μπορεί να τους κάνει όλους χαρούμενους.

Ο σχεδιασμός της ιστοσελίδας σας θα πρέπει λοιπόν να είναι σωστός και στοχευμένος. Όχι απλώς να σας κάνει χαρούμενους όταν τον βλέπετε.

6. Μη φοβάστε τον “λευκό χώρο”

Ο Leonardo Da Vinci είχε πει πως “η απλότητα, είναι η μεγαλύτερη επιτήδευση”.

Είναι εύκολο να σχεδιάσετε κάτι περίπλοκο και “φορτωμένο” αλλά δεν είναι και τόσο εύκολο να σχεδιάσετε κάτι απλό και λειτουργικό. Κι ας ακούγεται εύκολο.

Υπάρχει γενικά η τάση, ειδικά από άπειρους σχεδιαστές, να γεμίζουν κάθε πιθανό χώρο μιας ιστοσελίδας με κάτι.

Να θυμάστε πως η ιστοσελίδα σας πρέπει να “αναπνέει”. Κάθε στοιχείο πρέπει να έχει σωστή απόσταση από το άλλο και ακόμα και οι γραμμές κειμένου πρέπει να έχουν απόσταση που επιτρέπει την εύκολη ανάγνωση.

7. Δώστε μεγάλη έμφαση στην εταιρική σας ταυτότητα

Όλο το σχεδιαστικό κομμάτι της ιστοσελίδας θα πρέπει να στηρίζεται σχεδιαστικά στην εταιρική σας ταυτότητα.

Γι’ αυτό είναι και τόσο σημαντικός ο σχεδιασμός ενός ποιοτικού λογοτύπου και μιας ολοκληρωμένης εταιρικής ταυτότητας.

Μπαίνοντας ο επισκέπτης στην ιστοσελίδα σας από μια κάρτα που του δώσατε για παράδειγμα, θα πρέπει να δει κάτι ομοιόμορφο, όχι κάτι εντελώς διαφορετικό.

Ο σχεδιασμός ιστοσελίδας άλλωστε αποτελεί μια εφαρμογή της εταιρικής ταυτότητας. Δεν μπορεί και δεν πρέπει να διαφέρει.

8. Ο σχεδιασμός ιστοσελίδας δε χρειάζεται υπερβολές

Οι χρήστες της ιστοσελίδας σας δεν έρχονται για να διασκεδάσουν. Έρχονται για να πάρουν απαντήσεις και να λύσουν προβλήματα.

Αποφύγετε τα πολλά εφέ και εστιάστε στο περιεχόμενο, το οποίο θα πρέπει να είναι σωστά δομημένο και εύκολα προσβάσιμο.

Η ιστοσελίδα σας θα πρέπει να είναι έτσι σχεδιασμένη, ώστε ο χρήστης να πηγαίνει με αυτοπεποίθηση στη φόρμα παραγγελίας. Όχι με απορίες στη φόρμα επικοινωνίας.

Κάντε τη ζωή του εύκολη και η δική σας θα γίνει ευκολότερη.

9. Οι φωτογραφία είναι το Α και το Ω

Μια εικόνα ισούται με χίλιες λέξεις. Αν δε μπορείτε να επενδύσετε σε μια επαγγελματική φωτογράφιση, τότε σίγουρα θα πρέπει να κατευθυνθείτε σε μια τράπεζα εικόνων (π.χ. shutterstock).

Αποφύγετε με κάθε τρόπο τις φωτογραφίες που θα βρείτε στη Google γιατί πέρα από τα πνευματικά δικαιώματα, η ποιότητα τους είναι κατά κανόνα κακή.

Μια προσεκτικά επιλεγμένη και στοχευμένη φωτογραφία, μπορεί κυριολεκτικά να απογειώσει την αρχική σας σελίδα και όχι μόνο.

Κάθε φωτογραφία που ανεβαίνει στην ιστοσελίδα σας, θα πρέπει σίγουρα να είναι συμπιεσμένη (για να κερδίσετε σε ταχύτητα ιστοσελίδας) αλλά και να έχει την τονικότητα που ταιριάζει στην εταιρική σας ταυτότητα.

10. Μην αντιγράφετε τους ανταγωνιστές σας

Για το τέλος κρατήσαμε το πιο σημαντικό.

Σε καμία των περιπτώσεων μην αντιγράψετε κάποιον ανταγωνιστή σας.

Φυσικά και δεν υπάρχει παρθενογένεση, στον δημιουργικό κόσμο όλοι παίρνουν ιδέες από όλους. Άλλο όμως είναι να παίρνετε ιδέες που ξεκλειδώνουν την δημιουργικότητα σας, και άλλο να αντιγράφεται πιστά κάποιον ανταγωνιστή.

Η εύκολη παγίδα που μπορεί να πέσετε είναι η εξής: “Αφού το έκανε ο τάδε έτσι, θα το κάνω κι εγώ ίδιο και θα δουλέψει”.

Δεν θα δουλέψει!

Το ότι κάτι λειτουργεί για κάποιον ανταγωνιστή σας, δε σημαίνει ότι θα λειτουργήσει το ίδιο και για σας.

Επενδύστε σε ένα μοναδικό και μελετημένο σχεδιασμό ιστοσελίδας και μόνο κέρδος θα έχετε.